<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../js/jquery-3.6.0.min.js" type="text/javascript"></script>
    <script type="text/javascript">

      //单独定义删除元素方法
      function delTel(id){
        $("tr#"+id).remove();
      }

      $(function (){

        //定义全局变量 索引
        var index = 0;

        //添加添加按钮的点击事件
        $("#addTel").click(function (){
          var tel = $("<tr id='"+index+"' >" +
                  "<td>电话</td>" +
                  "<td><input type='tel'/></td>" +
                  "<td><input type='button' value='删除' onclick='delTel("+index+")'/></td>"+
                  "</tr>");
          $("table").append(tel);
          index++;
        })
      })
    </script>
</head>
<body>

  <center>

    <table border="1px">

      <caption>
        <input type="button" value="添加联系方式" id="addTel">
      </caption>

    </table>

  </center>

</body>
</html>